<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
            <title>上传头像--品购网</title>
            <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
            <link href="__PUBLIC__/css/com.css" rel="stylesheet" type="text/css" />
            <script src="__PUBLIC__/js/index.js" type="text/javascript"></script>
            <script src="__PUBLIC__/js/jquery.js" type="text/javascript"></script>
            <script src="__PUBLIC__/js/ajaxupload.js" type="text/javascript"></script>

            <style type="text/css">
                p{margin:0px;padding:0px;}
                .f{
                    float:left;
                }
                .c1,.c2{
                    width:320px;
                    height:180px;
                    margin:25px 0px 0px 60px;
                    padding:0px;
                    background: #FFFFCC;

                }
                .c2{
                    margin:25px 0px 0px 70px;
                    background: #CCFFFF
                }
                .bline{
                    border-bottom:1px #CBCBCB solid;
                }
                .ft1{
                    font-size: 13px; font-weight:600;color:#333;

                }
                #headpic{
                    width:240px;
                    height:240px;
                    border:1px #666 solid;
                    background:url(images/upload_head.png) no-repeat center #EBEBEB;
                    margin:38px auto;
                }
                span.m1{
                    margin-left:38px;
                }
                input.btnc1{
                    background:#D32D45;
                    width:90px;
                    height:24px;
                    border:1px #FF501A outset;
                    color:#fff;
                    font-size:14px;
                }
                input.btnc2{
                    background:#E0E0E0;
                    width:70px;
                    height:24px;
                    border:1px #C1C1C1 outset;
                    color:#333;
                    font-size:14px;
                }
                .cb1{background:#E6F2FF;height:560px}

            </style>
    </head>
    <body>
        
        <div class="cb1" style="background:#E6F2FF">
            <div class="f c2">
                <div id="headpic">
                    <noempty name="user.user_photo">
                        <center>
                            <img align="center" src="{$user.user_photo|default='__ROOT__/Public/images/user_photo.jpg'}" id="user_pic" width="239" height="239">
                        </center>
                    </noempty>
                </div>
                <center>
                    <span><input id="SaveHeadPicBtn" type="button" value="保存头像" class="btnc1" onclick="updateUserPic();"/></span>
                    <span><input id="SaveHeadPicBtn" type="button" value="删除头像" class="btnc1" onclick="delUserPic();"/></span>
                    <span class="m1"><input id="cancel_update" type="button" value="关闭" class="btnc2"/></span>
                </center>
            </div>
            <div class="f c1">
                <div class="bline ft1">更换头像</div>
                <p>
                    <span class="gray">请选择新的照片文件，文件需小于5M</span>
                    <input type="submit" name="upload" id="upload_button" value="上传图片" tyle="width:80px;height:28px;"/>
                </p>
            </div>
        </div>


    </body>
</html>

<script>
    $(document).ready(function(){
        
        var button = $('#upload_button'), interval;
        var fileType = "all",fileNum = "one";

        new AjaxUpload(button,{
            action: '__URL__/uploadPic',
            /*data:{
            'buttoninfo':button.text()
        },*/
            name: 'photo',
            onSubmit : function(file, ext){     

            },
            onComplete: function(file, response){
                if(response != "success"){
                    img = '<center><img id="user_pic" align=center src="__ROOT__/Public/Uploads/thumb_'+ response+"\"/></center>";
                    $("#headpic").html(img);
                    button.text('文件上传');
                    window.clearInterval(interval);
                    this.enable();
                }
                if(response == "success"){
                    alert(response);
                }
            }
        });

    });

    function updateUserPic(){
        url = "__URL__/updateUserPic";
        html = $("#headpic").html();
        if(html.length<20){
            alert('您还没有头像');
            return false;
        }
        src =$("#user_pic").attr('src');

        
        $.post(url, {user_photo:src}, function(data){
            if(data==1){
                alert('头像保存成功');
            }
            else{
                alert("头像保存失败");
            }
        });
    }
    function delUserPic(){
        url = "__URL__/delUserPic";
        $.post(url, {}, function(data){
            if(data==1){
                alert('头像删除成功');
                $("#headpic").html('');
            }
            else{
                alert("头像删除失败");
            }
        });
    }
   
</script>